import React, { memo, useContext } from "react"
import { UserContext, TokenContext } from "./context"
import { useUserToken } from "./hooks"
const Home = () => {
    const [user, token] = useUserToken()
    console.log(user)
    return (
        <div>
            <h1>Home</h1>
            <h2>user:{user.name}</h2>
            <h3>token:{token}</h3>
        </div>
    )
}

const About = () => {
    const [user, token] = useUserToken()

    return (
        <div>
            <h1>About</h1>
            <h2>user:{user.name}</h2>
            <h3>token:{token}</h3>
        </div>
    )
}

const App = memo(() => {
    return (
        <div>
            <h1>App Component</h1>
            <Home />
            <About />
        </div>
    )
})

export default App
